.ReadGj{
  height: 100%;
  width: 100%;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  display: flex;
  flex-direction: column;
  .Readhead{
        position: relative;
        // width: 1420px;
        width: 100%;
        min-width: 1200px;
        background-size: cover;
        height: 98px;
        margin: 0 auto;
        background-position-y: bottom;
        background-repeat: no-repeat;
    h4{
      position: absolute;
      top: 20%;
      left: 45%;
    }

  }
  .ReadContent::-webkit-scrollbar {
    display: none;
  }
  .ReadContent{
    flex: 1;
    min-width: 1200px;
    overflow: auto;
    padding: 0 10px 30px 10px;
    //个人关卡基本信息
    .ReadUp{
      margin-bottom: 10px;
      .ReadUp-content{
        display: flex;
        justify-content: space-between;
        .ReadUp-content1,.ReadUp-content2,.ReadUp-content3{
          flex: 1;
          padding: 5px 5px 5px 5px;
          height: 146px;
          background-color: rgba(255, 255, 255,.8);
          position: relative;
          display: flex;
          justify-content: center;
          box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.04);
          p{
            font-size: 14px;
            position: absolute;
            top: 5px;
            left: 5px;
            padding: 5;
            text-align: center;
            background-color: #1a77a5;
            border-radius: 2px;
            color: white;
            &::after{
              content: '';
              display: block;
              position: absolute;
              top: 0;
              right: -39px;
              width: 40px;
              height: 20px;
              background: linear-gradient(to right, #1a77a5 0%, transparent 100%)
            }
          }
        }
        .ReadUp-content1{
          margin-right: 10px;
          .counting{
            font-size: 40px;
            display: flex;
            align-items: center;
            font-weight: 500;
          }
        }
        .ReadUp-content2{
          margin-right: 10px;
          p{ 
            background-color: #1a77a5;
          }
          .ReadUp-content2-item{
            background-color: #dde7ec;
            position: relative;
            width: 365px;
            font-size: 16px;
            padding: 5px;
            margin: 25px 0 5px 10px;
            border-radius: 5px;
            ul{
              li{
                margin-bottom: 10px;
              }
            }
            .detail{
              position: absolute;
              top: -3px;
              right: 7px;
              cursor: pointer;
            }
            .item-status{
              position: absolute;
              bottom: 10px;
              right: 5px;
              padding: 5px;
              background-color: wheat;
              border-radius: 5px;
            }
          }
        }
        .ReadUp-content3{
          p{
            background-color: #1a77a5;
          }
          .counting{
            font-size: 40px;
            display: flex;
            align-items: center;
            font-weight: 500;
          }
        }
      }
    }
    //关卡排名信息
    .Readuser{
      padding: 5px;
      background-color: rgba(255, 255, 255);
            margin-bottom: 10px;   
      h5{
        margin: 0 0 5px 10px;
        padding: 5px;
        width: 115px;
        color: white;
        background-color: #1a77a5;
        position: relative;
        &::after{
          content: '';
          display: block;
          position: absolute;
          top: 0;
          right: -40px;
          width: 40px;
          height: 34px;
          background: linear-gradient(to right, #1a77a5 0%, transparent 100%);
      
        }
      }  
      .Readuser-p{
        display: flex;
        .ReadPerson{
          width: 30%;
          height: 300px;
          // background-color: wheat;
          font-size: 18px;
          padding-top: 50px;
          border-right: 1px solid #ccc;
          margin: 10px 10px 20px 5px ;
        }
        .ReadStages{
          width: 70%;
          height: 300px;
          margin: 10px 0 20px 0 ;
          .Chart-project{
            height: 290px;
          }
        }
      }
    }
    //延期统计
    .Readdelay{ 
      padding: 5px;
      background-color: rgba(255, 255, 255);      margin-bottom: 10px;
      box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.04);
      h5{
        margin: 0 0 5px 10px;
        padding: 5px;
        width: 80px;
        color: white;
        background-color: #1a77a5;
        position: relative;
        &::after{
          content: '';
          display: block;
          position: absolute;
          top: 0;
          right: -40px;
          width: 40px;
          height: 34px;
          background: linear-gradient(to right, #1a77a5 0%, transparent 100%);
      
        }
      }
      .Readdelay-project{
        display: flex;
        .Readdelay-project-left{
          width: 20%;
          margin-right: 10px;
          padding: 10px;
        }
        .Readdelay-project-right{
          height: 300px;
          width: 80%;
        }
      }
    }
    //逾期统计
    .ReadOutTimes{
      padding: 5px;
      margin-bottom: 10px;
      background-color: rgba(255, 255, 255);   box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.04);
      h5{
        margin: 0 0 5px 10px;
        padding: 5px;
        width: 80px;
        color: white;
        background-color: #1a77a5;
        position: relative;
        &::after{
          content: '';
          display: block;
          position: absolute;
          top: 0;
          right: -40px;
          width: 40px;
          height: 34px;
          background: linear-gradient(to right, #1a77a5 0%, transparent 100%);
      
        }
      }
      .Readdelay-project{
        display: flex;
        .Readdelay-project-left{
          width: 20%;
          margin-right: 10px;
          padding: 10px;
        }
        .Readdelay-project-right{
          height: 300px;
          width: 80%;
        }
      }
    }
  }
}